<template>
	<view class="content">
		<z-paging ref="paging" :auto-clean-list-when-reload="false" :auto-scroll-to-top-when-reload="false"
			style="height: calc(100% - 55px);">
			<!--仓库基本信息-->
			<view class="card">
				<view class="card-title">仓库信息</view>
				<view class="info-item">
					<text class="label">仓库名称：</text>
					<text class="value">{{infoObj.name || '暂无'}}</text>
				</view>
				<view class="info-item">
					<text class="label">仓库地址：</text>
					<text class="value">{{infoObj.address || '暂无'}}</text>
				</view>
				<view class="info-item">
					<text class="label">负责人：</text>
					<text class="value">{{infoObj.manager_name || '暂无'}}</text>
				</view>
				<view class="info-item">
					<text class="label">联系电话：</text>
					<text class="value">{{infoObj.phone || '暂无'}}</text>
				</view>
				<view class="info-item">
					<text class="label">状态：</text>
					<text class="value" :class="{'color-green': infoObj.visible == '1', 'color-red': infoObj.visible == '0'}">
						{{infoObj.visible == '1' ? '启用' : '禁用'}}
					</text>
				</view>
				<view class="info-item" v-if="infoObj.remark">
					<text class="label">备注：</text>
					<text class="value">{{infoObj.remark}}</text>
				</view>
			</view>
			
			<!--系统信息-->
			<view class="card">
				<view class="card-title">系统信息</view>
				<view class="info-item">
					<text class="label">创建人：</text>
					<text class="value">{{infoObj.create_user_name || '暂无'}}</text>
				</view>
				<view class="info-item">
					<text class="label">创建时间：</text>
					<text class="value">{{infoObj.create_time || '暂无'}}</text>
				</view>
				<view class="info-item" v-if="infoObj.update_time">
					<text class="label">更新时间：</text>
					<text class="value">{{infoObj.update_time}}</text>
				</view>
			</view>
		</z-paging>
		
		<bottomBoxVisible :sheetList="sheetList" :isAudit="infoObj.visible"
			@pageDeleteShowFun="pageDeleteShowFun" 
			@pageBianjiFun="pageBianjiFun"
			@pagehandleVisibleFun="pagehandleVisibleFun"></bottomBoxVisible>
	</view>
</template>

<script>
	let that = '';
	import { apiStockStore } from '@/api/crm.js'
	import bottomBoxVisible from '@/components/bottomBox/bottomBoxVisible'
	export default {
		components: {
			bottomBoxVisible
		},
		data() {
			return {
				infoObj: {},
				sheetList: [
					{ text: '编辑' },
					{ text: '删除' }
				],
				cardIndex: 0
			}
		},
		onLoad(e) {
			that = this;
			that.cardIndex = e.index || 0;
			if (e.fromDetail) {
				that.selectDetailByIdFun(e.id)
			} else {
				that.infoObj = uni.$stockStoreInfo || {};
			}
		},
		onShow() {
			if (uni.$stockStoreInfo && that.cardIndex != -1) {
				that.infoObj = uni.$stockStoreInfo;
			}
		},
		onBackPress(e) {
			if (e.from == 'backbutton' && this.cardIndex != -1) {
				let obj = this.infoObj;
				uni.$emit('updateStockStoreListByIndex', {
					index: this.cardIndex,
					obj
				})
			}
		},
		methods: {
			// 获取类型文本
			getTypeText(type) {
				const typeMap = {
					'1': '普通仓库',
					'2': '成品仓库',
					'3': '原料仓库'
				}
				return typeMap[type] || '未知类型';
			},
			// 编辑
			pageBianjiFun() {
				uni.$stockStoreInfo = that.infoObj;
				uni.navigateTo({
					url: './add?type=update'
				})
			},
			// 删除
			pageDeleteShowFun() {
				uni.showModal({
					title: '提示',
					content: '是否确认删除仓库：' + that.infoObj.name + '？',
					success(res) {
						if (res.confirm) {
							uni.showLoading({
								title: '删除中...',
								mask: true
							})
							let reqData = {
								action: 'del',
								params: {
									req: {
										id: that.infoObj.id
									}
								}
							}
							apiStockStore(reqData)
								.then(res => {
									uni.showToast({
										title: '删除成功!',
										duration: 888,
										icon: 'none'
									})
									uni.$emit('deleteCardFun', {
										index: that.cardIndex
									})
									setTimeout(() => {
										uni.redirectTo({
											url: './show'
										})
									}, 666)
								})
						}
					}
				})
			},
			// 启用/禁用
			pagehandleVisibleFun: function(action) {
				uni.showModal({
					title: '提示',
					content: action === 'enable' ? '确认启用此仓库吗？' : '确认禁用此仓库吗？',
					success(res) {
						if (res.confirm) {
							uni.showLoading({
								title: '处理中...',
								mask: true
							})
							let reqData = {
								action: action === 'enable' ? 'enable' : 'disable',
								params: {
									req: {
										id: that.infoObj.id,
                                        name:'visible',
										value: action === 'enable' ? '1' : '0'
									}
								}
							}
							apiStockStore(reqData)
								.then(res => {
									uni.hideLoading()
									if (res.code === 1) {
										uni.showToast({
											title: action == 'enable' ? '启用成功!' : '禁用成功!',
											duration: 2000,
											icon: 'none'
										})
										// 重新加载数据
										setTimeout(() => {
											that.selectDetailByIdFun()
										}, 666)
									} else {
										uni.showToast({
											title: res.message || '操作失败',
											duration: 2000,
											icon: 'none'
										})
									}
								})
						}
					}
				})
			},
			// 根据id查询详情
			selectDetailByIdFun(_id) {
				uni.showLoading({
					title: '加载中...',
					mask: true
				})
				let reqData = {
					action: 'get_detail',
					params: {
						req: {
							id: _id || that.infoObj.id
						}
					}
				}
				apiStockStore(reqData)
					.then(res => {
						if (res.code == 1) {
							that.infoObj = res.data;
							uni.$stockStoreInfo = res.data;
							setTimeout(() => {
								uni.hideLoading()
							}, 888);
						} else {
							uni.showModal({
								title: '提示',
								content: '相关内容不存在，或者已被删除！',
								showCancel: false,
								success() {
									uni.navigateBack()
								}
							})
						}
					})
			}
		}
	}
</script>

<style>
	/* 确保页面有固定高度 */
	page {
		height: 100%;
		background-color: #F8F8F8;
	}

	.content {
		height: 100%;
		/* 使用flex布局确保底部组件紧贴底部 */
		display: flex;
		flex-direction: column;
	}
	
	.card {
		background-color: #FFFFFF;
		margin: 20rpx;
		border-radius: 10rpx;
		padding: 30rpx;
	}
	
	.card-title {
		font-size: 32rpx;
		font-weight: bold;
		margin-bottom: 20rpx;
		color: #333;
	}
	
	.info-item {
		display: flex;
		margin-bottom: 16rpx;
		font-size: 28rpx;
	}
	
	.label {
		width: 150rpx;
		color: #666;
	}
	
	.value {
		flex: 1;
		color: #333;
	}
	
	.color-green {
		color: #67C23A;
	}
	
	.color-red {
		color: #F56C6C;
	}
</style>